import { useState, useEffect } from 'react'
import DarkBtn from '../../../../../../common/DarkBtn';
import { FullscreenExitOutlined, FullscreenOutlined } from '@ant-design/icons';
import { useFullscreen } from 'ahooks';

export default function FullScreen(props) {
    const [isFullscreen, { enterFullscreen, exitFullscreen, toggleFullscreen }] = useFullscreen(document.getElementById('full-screen-content'));
    return <>
        <DarkBtn icon={isFullscreen ? <FullscreenExitOutlined /> : <FullscreenOutlined />} title={isFullscreen ? "退出全屏" : "进入全屏"} onClick={e => {
            toggleFullscreen()
        }}></DarkBtn>
    </>;
}